TypeScript中interface与type的区别

interface 与 type 的区别

interface 用于声明接口，type 用于声明类型别名

相同点

1.都可以描述一个对象或方法

interface

interface User {
  name: string
  age: number
}

interface SetUser {
  (name: string, age: number): void;
}

type

type User = {
  name: string
  age: number
};

type SetUser = (name: string, age: number): void;

2.interface 可以继承 interface 或 type

interface Name{
    name: string
}

interface User extends Name{
    age: number
}

type Age = {
    age: number
}

interface User extends Age{
    name: string
}

3.type 可以与 interface 或者 type 交叉

interface Name{
    name: string
}

type User = Name & {
    age: number
}

type Name = {
    name: string
}

type User = Name & {
    age: number
}

不同点

type 可以声明基本类型别名，联合类型，元组等类型

基本类型

type Name = string

联合类型

interface Dog{
    wang(): string
}

interface Cat{
    miao(): string
}

type Pet = Dog | Cat

元组（具体定义数组每个位置的类型）

type Arr = [string, number]

type 还可以使用 typeof 获取实例的类型进行赋值

let div = document.createElement('div');
type B = typeof div

interface 可以声明合并

interface User {
  name: string
  age: number
}

interface User {
  sex: string
}

/*
User 接口为 {
  name: string
  age: number
  sex: string
}
*/